<template>
	<div class="hot-list">
		<div class="title">
			<img src="/api/img/hot.png"/>
			<span>本周热门榜单</span>
			<span class="title-right">全部榜单	&gt;</span>
		</div>
		<ul>
			<li v-for="item in list" :key="item.id">
				<img :src="item.imgUrl" />
				<p class="til">{{item.til}}</p>
				<p><span>{{item.price}}</span>起</p>
			</li>
			
		</ul>
	</div>
</template>

<script>
export default {
	props:["list"],
	data(){
		return {
/*			list:[
			{
				id:1,
				imgUrl:"http://img1.qunarzz.com/sight/p0/201403/10/b7aa220089fa8054e6e012bafff63042.jpg_150x150_8b349cb3.jpg",
				til:"长沙动植物园",
				price:"¥105"
			},
			{
				id:2,
				imgUrl:"http://img1.qunarzz.com/sight/p0/201403/10/b7aa220089fa8054e6e012bafff63042.jpg_150x150_8b349cb3.jpg",
				til:"长沙动植物园",
				price:"¥105"
			},
			{
				id:3,
				imgUrl:"http://img1.qunarzz.com/sight/p0/201403/10/b7aa220089fa8054e6e012bafff63042.jpg_150x150_8b349cb3.jpg",
				til:"长沙动植物园",
				price:"¥105"
			},
			{
				id:4,
				imgUrl:"http://img1.qunarzz.com/sight/p0/201403/10/b7aa220089fa8054e6e012bafff63042.jpg_150x150_8b349cb3.jpg",
				til:"长沙动植物园",
				price:"¥105"
			},
			{
				id:5,
				imgUrl:"http://img1.qunarzz.com/sight/p0/201403/10/b7aa220089fa8054e6e012bafff63042.jpg_150x150_8b349cb3.jpg",
				til:"长沙动植物园",
				price:"¥105"
			},
			{
				id:6,
				imgUrl:"http://img1.qunarzz.com/sight/p0/201403/10/b7aa220089fa8054e6e012bafff63042.jpg_150x150_8b349cb3.jpg",
				til:"长沙动植物园",
				price:"¥105"
			},
			{
				id:7,
				imgUrl:"http://img1.qunarzz.com/sight/p0/201403/10/b7aa220089fa8054e6e012bafff63042.jpg_150x150_8b349cb3.jpg",
				til:"长沙动植物园",
				price:"¥105"
			},
			{
				id:8,
				imgUrl:"http://img1.qunarzz.com/sight/p0/201403/10/b7aa220089fa8054e6e012bafff63042.jpg_150x150_8b349cb3.jpg",
				til:"长沙动植物园",
				price:"¥105"
			}
			]*/
		}
	}
}
	
	
	
</script>

<style scoped>
	.hot-list{
		background: #FFFFFF;
	}
	.hot-list .title{
		font-size: .16rem;
		height: .47rem;
		line-height: .47rem;
		margin-top: 0.2rem;
		padding-left: .1rem;
	}
	.hot-list .title img{
		width: .15rem;
		height: .15rem;
	}
	
	.hot-list .title .title-right{
		font-size: .1rem;
		float: right;
		padding-right: .1rem;
		color: #999999;
	}
	.hot-list ul{
		overflow-x: scroll;
		overflow-y: hidden;
		white-space: nowrap;
		height: 1.53rem;
		padding:0 .1rem;
	}
	.hot-list li{
		font-size: .12rem;
		width: 1rem;
		margin-right: .1rem;
		text-align: center;
        display: inline-block;
	}
	.hot-list li:last-child{
        margin-right: 0rem;
		
	}
	.hot-list li img{
		width: 100%;
	}
	.hot-list li p.til{
		padding: .05rem 0;
	}
	
	.hot-list li span{
		font-size: .14rem;
		color: #f60;
	}
</style>